<template>
  <el-container>
    <el-header>Header</el-header>
    <el-container>
      <el-aside width="200px">
        <Aside class="leftMenu"></Aside>
      </el-aside>
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>
<script>
import Aside from './Aside'
export default {
  name: 'App',
  components: {
    Aside
  }
}
</script>
<style lang="less" scoped>
.el-container {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0;
  bottom: 0;
}
.el-header {
  color: aliceblue;
  padding: 0;
  z-index: 1000;
  background-color: #00215e; //#003CAA
}
.el-aside {
  background-color: #00215e;
  margin-bottom: 4px;
  .leftMenu {
    margin-top: 60px;
  }
}
.el-main {
  background-color: whitesmoke;
  color: black;
  border-radius: 5px;
  box-shadow: 0 0 5px 1px #ffffff;
  margin: 64px 4px 4px 4px;
}
</style>

